import React, { Component } from 'react';
import { Menu } from 'antd'; // 引入菜单组件
import { Route, Switch } from 'react-router-dom'
import Sass1 from './sass1'
import  './css/index.css'



export default class Test extends Component {
  onMenuClick = (e) => { // 菜单被点击的回调
    this.props.history.push(e.key); // 跳转到响应的页面
  }
  render() {
    const items = [
      {
        key: '/sass/sass1', // key指定为路由的名称，我们配置为路由的path，用来跳转
        label: 'Sass练习1', // 菜单显示内容
      },

    ];
    return (
      <div className='big-box'>
          <Menu className='menu' items={items} mode="horizontal" onClick={this.onMenuClick}></Menu>
       
        <Switch className='switch'>
          <Route path="/sass/sass1" component={Sass1}></Route>

        </Switch>
      </div>
    );
  }
}
